<html>
<head>
    <title>Circle w/ dataset</title>
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAheS9Xi-Yv_ZyWjQrMAtLyxSXi3ULrnowvlcblO1CcYDzFprW4BSmWEaCS455H93bNLDyyoFMFv3drw" type="text/javascript"></script>
    <script type="text/javascript" language="javascript" src="../js/CircleOverlay.js"></script>
    <script type="text/javascript" language="javascript" src="../js/latlng.js"></script>
<script type="text/javascript" language="javascript" src="../js/OpenError.js"></script>
<script type="text/javascript" language="javascript" src="../js/data_params.js"></script>
<script type="text/javascript" language="javascript" src="../js/DispObjects.js"></script>
<script type="text/javascript" language="javascript">
/////////////////////
// GLOBALS
/////////////////////
var map;
var oe;
var disp;
	
function DrawObjects()
{
	var data = oe.generateDataset(); // generate a new data set with offset errors
	var original = oe.getDataSet(); // this seems redundant, but lets us change which data set we're using in the main load function alone

	// draw initial set of points
	disp.addPoints();
	
	for(var i =0;i<data.length;i++)
	{
		// create data for circle object
		// TODO: move this as createCircles() function to disp object
		var circle = new CircleOverlay(new GLatLng(original.coordinates[i][0],original.coordinates[i][1]), (oe.getStandardDeviation() / 1609.344), "#336699", 1, 1, '#336699', 0.25);
			
		var c = new CObject();
		c.overlay = circle;
		c.sd = 1;
		disp.c_objects.push(c);
		
	}
	
	// show points and circles by default
	disp.showPoints();
	disp.showCircles();
}
	
	
    //<![CDATA[
    
    function load() {
       // if (isCompatible) {
            // Create Map
            map = new GMap2(document.getElementById("map"));
            var zoom = 5;
            map.setCenter(new GLatLng(45, 0), zoom);

            // Add controls
            map.addControl(new GLargeMapControl());
            map.addControl(new GMapTypeControl());
			

			
			// create a new openerror object for introducing controlled error
			oe = new OpenError();

			oe.setDataSet(ptsLine);  // var created on dataset.js file
			oe.setStandardDeviation(100000 ); //1609.344 ~ mile);
			oe.setDebug(true);
			oe.setCorrelated( false );
			//oe.set
			
			disp = new DispObject("map");
			DrawObjects();
			
			for(var i=0;i<9;i++)
			{
				disp.addPoints();
			}

        //}
    }
    //]]>
    </script>
<style>
table,tr,td,th
{
	border: solid 1px gray;
}
</style>
</head>
<body onLoad="load()" onUnload="GUnload()">
	<div style="margin:auto;text-align:center;">
		<div id="mapWrapper" style="float: left;">
			<div id="map" style="width: 400px; height: 300px; border: 1px solid #666666;"></div>
		</div>
		<div style="margin-left: 400px;text-align:left">
			<strong>Points: </strong>
			<input type="button" onclick="disp.showPoints();" value="Show">
			<input type="button" onclick="disp.hidePoints();" value="Hide"><br/><br/>
			<strong>Circles: </strong>
			<input type="button" onclick="disp.showCircles();" value="Show">
			<input type="button" onclick="disp.hideCircles();" value="Hide"><br/>
			<div id="results"></div>
		</div>
		<div style="clear:both;"></div>
	</div>
	<div id="debug"></div>
</body>
</html>